<template>
  <div class="box">
    <div class="header">
      <span class="iconfont icon-fanhui" @click="back()"></span>
      <div class="title">收藏</div>
    </div>
    <div class="main">
      <div class="con">
        <img src="../../static/资讯.png" alt="" />
        <div class="text">
          <h3 >石景山 紧邻龙湖天街S1 生活配套齐全</h3>
          <p>43平/2室 1厅 /远洋新天地</p>
          <span style="color: #f90">2000/月</span>
          <p class="div">小区</p>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import "../../static/iconfont/font_g5b9ldx0nvj/iconfont.css";
export default {
  methods: {
    back() {
      uni.navigateBack();
    },
  },
};
</script>

<style lang='scss'>
.box {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  .header {
    width: 100%;
    height: 200rpx;
    background: linear-gradient(90deg, #0272f0, #36a2fe);
    display: flex;
    align-items: center;
    position: relative;
    top:0;
    position:sticky;
    span {
      position: absolute;
      left: 40rpx;
      top: 50%;
      transform: translate(0, -50%);
      color: #fff;
    }
    .title {
      width: 100%;
      text-align: center;
      color: #fff;
    }
  }
  .con {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    img {
      width: 384rpx;
      height: 204rpx;
    }
    .text{
        h3,p,span{
            font-size: 30rpx;
        }
        h3{
            font-weight: 900;
        }
        .div{
            width: 150rpx;
            height: 40rpx;
            text-align: center;
            line-height: 40rpx;
            background: #eee;
        }
    }
  }
}
</style>